<!DOCTYPE html>
<html lang="zh-cn">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.0.js"></script>
    <title>Document</title>
  </head>
  <style></style>

  <body>
    <input id="inputBox" type="text" oninput="myInput(this)" />
    <br />
    <br />
    <button onclick="btnClick()">按钮</button>
  </body>
  <script>
    // 获取输入框元素
    const inputBox = document.getElementById("inputBox");

    // 绑定input事件
    inputBox.addEventListener("input", function (event) {
      // 获取输入框的内容
      const content = event.target.value;

      // 打印事件和内容
      console.log("input事件 + " + content);
    });
    function myInput(val) {
      console.log("input事件 + " + val.value);
    }

    function btnClick() {
      console.log("点击");

      let inputElement = document.getElementsByClassName("input")[0];

      inputElement.value = 111;
      // 创建一个新的input事件
      const inputEvent = new Event("input");

      // 触发input事件
      inputElement.dispatchEvent(inputEvent);
    }
  </script>
</html>
